<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" >
<!--/* Title of this template will be passed to the head fragment along with custom links and scripts */-->
<head th:replace="task/layout :: head(~{this :: title}, ~{this :: .custom-link}, ~{this :: .custom-script})">
    <title>Task Details</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link href="../../../resources/css/bootstrap.min.css" rel="stylesheet" media="screen" th:href="@{/resources/css/bootstrap.min.css}"/>
    <link href="../../../resources/css/core.css" rel="stylesheet" media="screen" th:href="@{/resources/css/core.css}"/>
    
    <!-- Custom links for this page only -->
    <link class="custom-link" href="../../../resources/css/task/task.css" th:href="@{/resources/css/task/task.css}" />
    
    <script src="../../../resources/js/jquery.min.js" th:src="@{/resources/js/jquery.min.js}"></script>
    <script src="../../../resources/js/bootstrap.min.js" th:src="@{/resources/js/bootstrap.min.js}"></script>
    
    <!-- Custom scripts for this page only -->
    <script class="custom-script" src="../../../resources/js/task/task.js" th:src="@{/resources/js/task/task.js}"></script>
    
</head>
<body>

<!--/* The element with breadcrumb class will be passed to the header fragment */-->
<header th:insert="task/layout :: header(~{ :: .breadcrumb})">
    <ol class="breadcrumb container">
        <li><a href="#">Home</a></li>
        <li><a href="#" th:href="@{/task}">Tasks</a></li>
        <li th:text="${'Task ' + task.id}">Task</li>
    </ol>
</header>

<!--/* Insert content fragment with content of the element with id = 'task-details' */-->
<div th:insert="task/layout :: content(~{ :: #task-details})">
    <div id="task-details">
        <h2 th:text="${task.title}">Task Details</h2>
        <div th:text="${task.text}">Text</div>
    </div>
</div>

</body>
</html>